import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { map } from 'rxjs/operators';

import { SettingsService } from '../../services/settings.service';
import { PositionService } from '../../services/position.service';
import { SoftwareCategoryService } from '../../services/software-category.service';
import { FormControl, Validators } from '@angular/forms';

@Component({
	selector: 'm-enterprise',
	templateUrl: './enterprise.component.html',
	styleUrls: ['./enterprise.component.scss'],
})
export class EnterpriseComponent implements OnInit {
	constructor(
		private route: ActivatedRoute,
		private router: Router,
		private service: SettingsService,
		public positionService: PositionService,
		public softwareCategory: SoftwareCategoryService,
	) {}

	nameControl = new FormControl('', Validators.required);
	profile$ = this.route.data.pipe(map(data => data['profile']));

	ngOnInit() {
		this.profile$.subscribe(data => {
			this.nameControl.setValue(data.name);
		});
	}

	changeName(value) {
		this.nameControl.reset(value)
		if (this.nameControl.invalid) {
			return;
		}
		this.service.patch({ name: this.nameControl.value });
		this.reload();
	}

	async changeImage(name: 'logo' | 'favicon', input: HTMLInputElement) {
		const formData = new FormData();
		formData.set(name, input.files[0]);
		await this.service.patch(formData);
		this.reload();
	}

	reload() {
		this.router.navigated = false;
		this.router.navigate([], { queryParamsHandling: 'merge' });
	}
}

interface IconInfo {
	id: number;
	link: string;
	title: string;
	prompt: string;
}

interface Department {
	id: number;
	name: string;
	job_list: string[];
}

interface Category {
	id: number;
	name: string;
}
